<template>
    <view>
        <div style="display: flex; margin-bottom: 10px; background-color: white; padding: 15px;">
            <div>
                <image :src="objParams.tbOrderGoods.image ? objParams.tbOrderGoods.image + '?imageView2/1/w/100/h/100' : '/pages/sub/sub2-store-platform/static/default-image/goods.jpg'"
                       mode="aspectFill" style="width: 100px; height: 100px;"></image>
            </div>
            <div style="padding-left: 10px;">
                <div style="font-size: 14px;">
                    {{ objParams.tbOrderGoods.title }}
                </div>
                <div style="font-size: 12px; color: grey;">
                    {{objParams.tbOrderGoods.specName}}
                    <label v-if="objParams.tbOrderGoods.colorId">;{{objParams.tbOrderGoods.colorName}}</label>
                </div>
                <div style="width: 100%; font-size: 12px;">
                    申请数量：{{objParams.quantity}}
                </div>
                <div style="width: 100%; text-align: right; padding-right: 5px;" v-if="objParams.payMode === '0' && objParams.afterSaleType === '1'">
                    退款金额：<label style="color: red;">￥{{(objParams.refundMoney) | toFixed2}}</label>
                </div>
            </div>
        </div>
        <div style="padding: 15px;">

            <div v-if="urlParams.progress === '1'">
                <u-form ref="validateFormRef" :model="validateForm.value" :label-width="150">
                    <u-form-item label="退货地址" prop="storeSenderId" required right-icon="arrow-right">
                        <u-input v-model="validateForm.value.storeSenderText" type="textarea" height="40" :clearable="false" :disabled="true" placeholder="请选择选择退货地址，先在[店铺管理/寄件人管理]添加地址信息"
                                 right-icon="arrow-right"
                                 @click="navigateTo(`/pages/sub/sub2-store-platform/store-platform/store-platform-store-manage/store-platform-store-sender/store-platform-store-sender-select/index`, null, validateForm.value)"/>
                    </u-form-item>
                    <u-form-item label="备注" prop="progress1Remark">
                        <u-input type="textarea" height="40" v-model="validateForm.value.progress1Remark"/>
                    </u-form-item>
                </u-form>
            </div>

            <div v-if="urlParams.progress === '3'">
                <u-form ref="validateFormRef" :model="validateForm.value" :label-width="150">
                    <u-form-item label="备注" prop="progress3Remark">
                        <u-input type="textarea" height="40" v-model="validateForm.value.progress3Remark"/>
                    </u-form-item>
                </u-form>
            </div>

            <div v-if="urlParams.progress === '4'">
                <u-form ref="validateFormRef" :model="validateForm.value" :label-width="150">
                    <u-form-item label="拒绝理由" prop="refundRefuseReason">
                        <u-input type="textarea" height="40" v-model="validateForm.value.refundRefuseReason" placeholder="请输入拒绝售后申请理由"/>
                    </u-form-item>
                </u-form>
            </div>

            <u-button type="error" @click="submit()">提交</u-button>
        </div>
    </view>
</template>

<script>

    import {CommonUtil} from "@/dev/core/utils/common.util";
    import {TbOrderGoodsAfterSaleService} from "@/dev/services/tb-order-goods-after-sale.service";

    export default {
        data() {
            return {
                validateForm: {
                    value: {
                        id: '',
                        progress: '',
                        progress1Remark: '',
                        progress2Remark: '',
                        progress3Remark: '',
                        progress4Remark: '',
                        progress5Remark: '',
                        refundRefuseReason: '',
                        // 收货地址
                        tbStoreSender: null,
                        storeSenderId: '',
                        storeSenderText: '',
                        refundGoodsConsignee: '',
                        refundGoodsPhone: '',
                        refundGoodsProvinceName: '',
                        refundGoodsCityName: '',
                        refundGoodsAreaName: '',
                        refundGoodsAddress: '',
                    },
                    rules: {
                        id: [
                            {required: true, message: '必填项!', trigger: ['change', 'blur']},
                            {pattern: /^(?=.*\S).+$/, message: '必填项!', trigger: ['change', 'blur']},
                        ],
                        progress: [
                            {required: true, message: '必填项!', trigger: ['change', 'blur']},
                            {pattern: /^(?=.*\S).+$/, message: '必填项!', trigger: ['change', 'blur']},
                        ],
                        refundRefuseReason: [
                            {
                                trigger: ['blur'],
                                asyncValidator: (rule, value, callback) => {
                                    if (this.validateForm.value.progress === '4' && !value) {
                                        callback(new Error('请输入拒绝售后申请理由！'))
                                    } else {
                                        callback()
                                    }
                                }
                            }
                        ],
                        storeSenderId: [
                            {
                                trigger: ['blur'],
                                asyncValidator: (rule, value, callback) => {
                                    if (this.validateForm.value.progress === '1' && !value) {
                                        callback(new Error('请选择退货地址！'))
                                    } else {
                                        callback()
                                    }
                                }
                            }
                        ],
                    }
                }
            }
        },
        onReady() {
            const _self = this
            console.log(this.validateForm)
            this.validateForm.value.id = this.objParams.id;
            this.validateForm.value.progress = this.urlParams.progress;
        },
        methods: {
            submit() {
                const _self = this;
                _self.$refs.validateFormRef.validate(valid => {
                    if (valid) {
                        console.log('验证通过', _self.validateForm.value);
                        CommonUtil.alert({
                            title: '提示！',
                            content: '确认提交吗？',
                            showCancel: true, // 是否显示取消按钮
                            success: function (res) {
                                if (res.cancel) { // 点击取消,默认隐藏弹框
                                } else { // 点击确定
                                    if (_self.validateForm.value.progress === '1') {
                                        _self.validateForm.value.refundGoodsConsignee = _self.validateForm.value.tbStoreSender.name;
                                        _self.validateForm.value.refundGoodsPhone = _self.validateForm.value.tbStoreSender.phone;
                                        _self.validateForm.value.refundGoodsProvinceName = _self.validateForm.value.tbStoreSender.provinceName;
                                        _self.validateForm.value.refundGoodsCityName = _self.validateForm.value.tbStoreSender.cityName;
                                        _self.validateForm.value.refundGoodsAreaName = _self.validateForm.value.tbStoreSender.areaName;
                                        _self.validateForm.value.refundGoodsAddress = _self.validateForm.value.tbStoreSender.address;
                                    }
                                    new TbOrderGoodsAfterSaleService().updateTbOrderGoodsAfterSale(_self.validateForm.value).then(result => {
                                        if (result.status === "success") {
                                            Object.assign(_self.objParams, CommonUtil.deleteNullAttrInObject(result.data));
                                            CommonUtil.toastNavigateBack('操作成功');
                                        } else {
                                            CommonUtil.alert(result.message);
                                        }
                                    });
                                }
                            }
                        });
                    } else {
                        console.log('验证失败');
                    }
                });
            }
        }
    }
</script>

<style lang="scss" scoped>
</style>
